Skip to content

web/style/flow: flow css barrel file#20833

Open
kensternberg-authentik wants to merge 6 commits intomainfrom
web/style/flow-css-barrel-file
Open

web/style/flow: flow css barrel file#20833
kensternberg-authentik wants to merge 6 commits intomainfrom
web/style/flow-css-barrel-file

Conversation

@kensternberg-authentik
Copy link
Contributor

@kensternberg-authentik kensternberg-authentik commented Mar 10, 2026

What

Replaces the “stock” CSS that we were using for all the authentik WebUI interfaces with a custom barrel file that has the right CSS in the right order:

  • Adjust the template to call a different CSS file
  • Adjust the paths to include that CSS file
  • Adjust the build to process the CSS file into the distribution
  • Provide the CSS file

Why

The previous routine attempted to “override” the authentik.css file with its own static.css, but the order provided caused a CSS reset file (patternfly-common.css) to be injected into the middle of the CSS reads; as a result, compatibility mode often had weird margin or padding failures because the reset targeted specific Patternfly component libraries that weren’t exposed in the normal course of operation. We’ve got those so specified and hammered into steel that this change didn’t actually affect anything, but we shouldn’t have to perform such magic in the first place.

Aside from the fix to ensure patternfly-common.css is in the right place, no functionality or behavioral changes are intended or should be visible with this code.

  • The code has been formatted (make web)

…rnative stylesheets

## What

Moves the stylesheet invocation in `theme.html` to `skeleton.html`, give it a block and a block name so that pages using `skeleton.html` can override or extend it as needed.

## Why

The biggest wall we’re hitting right now is the lack of flexibility at the very top of the CSS. We simply use the same CSS file for *too much*, when really we should be thinking in terms of leaner, more targeted top-level CSS for some things, and more rich and expressive CSS when it’s necessary.

The style sheet was being loaded unconditionally in `theme.html`; it’s not in a conditional statement or overridable where it was; `skeleton` just loads it blindly. This change lets `theme.html` be what it is meant to be, an isolated container for the JavaScript logic for discerning the color mode, while enabling CSS developers to elide the stylesheet, provide alternative stylesheets, or (using `{{ block.super}}`) amend or extend the default stylesheet.
* main: (23 commits)
  web: CodeSpell -> CSpell migration (#20188)
  core: bump goauthentik.io/api/v3 to 3.2026.5.0-rc1-1773052201 (#20801)
  core: bump github.com/go-openapi/runtime from 0.29.2 to 0.29.3 (#20787)
  core: bump golang.org/x/sync from 0.19.0 to 0.20.0 (#20788)
  web: bump the storybook group across 1 directory with 5 updates (#20794)
  core: bump golang.org/x/oauth2 from 0.35.0 to 0.36.0 (#20789)
  core: bump goauthentik/selenium from 145.0-ak-0.40.3 to 145.0-ak-0.40.5 in /tests/e2e (#20790)
  core: bump black from 26.1.0 to 26.3.0 (#20791)
  core: bump cachetools from 7.0.3 to 7.0.4 (#20792)
  core: bump goauthentik/fips-python from `38c4dd2` to `b481db2` in /lifecycle/container (#20796)
  web: bump @rollup/plugin-commonjs from 29.0.1 to 29.0.2 in /web in the rollup group across 1 directory (#20795)
  core: bump astral-sh/uv from 0.10.8 to 0.10.9 in /lifecycle/container (#20797)
  core: bump goauthentik/fips-debian from `4966b90` to `6c9197b` in /lifecycle/container (#20798)
  web: bump @types/node from 25.3.3 to 25.3.5 in /web (#20799)
  web: bump knip from 5.85.0 to 5.86.0 in /web (#20800)
  enterprise/endpoints/connectors: add google_chrome (#19129)
  providers/oauth2: decode percent-encoded basic auth (#20779)
  web: bump immutable from 5.1.4 to 5.1.5 in /web (#20720)
  web: bump the storybook group across 1 directory with 5 updates (#20731)
  web: bump @rollup/plugin-commonjs from 29.0.0 to 29.0.1 in /web in the rollup group across 1 directory (#20732)
  ...
* main:
  core: allow interfaces to specify alternative stylesheets (#20774)
  website/docs: update agent docs (#20782)
  core, web: update translations (#20809)
  lifecycle/aws: bump aws-cdk from 2.1109.0 to 2.1110.0 in /lifecycle/aws (#20810)
  core: bump axllent/mailpit from v1.29.2 to v1.29.3 in /tests/e2e (#20811)
  core: bump cachetools from 7.0.4 to 7.0.5 (#20812)
  core: bump goauthentik/fips-python from `b481db2` to `3636935` in /lifecycle/container (#20814)
  core: bump goauthentik/fips-debian from `6c9197b` to `0975985` in /lifecycle/container (#20815)
  web: bump the storybook group across 1 directory with 5 updates (#20816)
  web: bump cspell from 9.6.4 to 9.7.0 (#20817)
  web: bump @formatjs/intl-listformat from 8.2.1 to 8.2.2 in /web (#20818)
  web: bump mermaid from 11.12.3 to 11.13.0 in /web (#20819)
  web: bump @types/node from 25.3.5 to 25.4.0 in /web (#20820)
  endpoints/connectors/agent: cleanup leftover (#20808)
  endpoints: prevent selection of incompatible connector (#20806)
  website/docs: Add steps to set up group devices (#20735)
  web/rbac: disambiguate duplicate permission names in initial permissions (#20786)
* main:
  providers/SCIM: Add discover support (#20658)
@netlify
Copy link

netlify bot commented Mar 10, 2026

Deploy Preview for authentik-storybook ready!

Name Link
🔨 Latest commit 4273b15
🔍 Latest deploy log https://app.netlify.com/projects/authentik-storybook/deploys/69b08784274f9600099400e9
😎 Deploy Preview https://deploy-preview-20833--authentik-storybook.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@kensternberg-authentik kensternberg-authentik marked this pull request as ready for review March 10, 2026 21:06
@kensternberg-authentik kensternberg-authentik requested review from a team as code owners March 10, 2026 21:06
@netlify
Copy link

netlify bot commented Mar 10, 2026

Deploy Preview for authentik-docs ready!

Name Link
🔨 Latest commit 4273b15
🔍 Latest deploy log https://app.netlify.com/projects/authentik-docs/deploys/69b0878478c4c8000893e33e
😎 Deploy Preview https://deploy-preview-20833--authentik-docs.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@codecov
Copy link

codecov bot commented Mar 10, 2026

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 93.42%. Comparing base (949d1ea) to head (4273b15).
✅ All tests successful. No failed tests found.

Additional details and impacted files
@@            Coverage Diff             @@
##             main   #20833      +/-   ##
==========================================
- Coverage   93.45%   93.42%   -0.04%     
==========================================
  Files         993      993              
  Lines       55968    55968              
==========================================
- Hits        52305    52286      -19     
- Misses       3663     3682      +19     
Flag Coverage Δ
conformance 37.54% <ø> (+<0.01%) ⬆️
e2e 43.06% <ø> (+<0.01%) ⬆️
integration 22.24% <ø> (-0.05%) ⬇️
unit 91.62% <ø> (+<0.01%) ⬆️
unit-migrate 91.71% <ø> (+<0.01%) ⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@BeryJu BeryJu changed the title Web/style/flow: flow css barrel file web/style/flow: flow css barrel file Mar 11, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants